{% extends "bouting/base.html" %}
{% block jquery%}
    if($("#fencer").attr('checked'))
    {
        $("#personForm").attr('hidden', '');
    }
    if($("#usfa").attr('checked'))
    {
        $("#fencer").attr('checked', '');
        $("#personForm").attr('hidden', '');
        $("#usfaForm").attr('hidden', '');
    }
    $("#fencer").click(function(){
        if($("#fencer").attr('checked'))
        {
            $("#usfa").attr('checked', '');
            $("#personForm").fadeIn();
            $("#usfaForm").fadeOut();
        }
        else
        {
            $("#personForm").fadeOut();
            $("#usfaForm").fadeOut();
        }
    });

    $("#usfa").click(function(){
        if($("#usfa").attr('checked'))
        {
            $("#fencer").attr('checked', '');
            $("#personForm").fadeIn();
            $("#usfaForm").fadeIn();
        }
        else
        {
            $("#personForm").fadeOut();
            $("#usfaForm").fadeOut();
        }
    });
{% endblock %}
{% block content %}
    
    {% if user != null and not user.is_anonymous %}
        <h2>Hey, you're already signed in! Stop it mister!</h2>
        
    {% else %}
        <form action="/bouting/signUp/" method="post">
            {% csrf_token %}
            {{userForm.as_p}}
            Sign up as a:<br>
            Non-USFA Fencer:<input type="checkbox" name="fencer" id="fencer"></input><br>
            USFA Fencer:<input type="checkbox" name="usfa" id="usfa"></input>
            <div id='personForm' hidden=''>
                {{personForm.as_p}}
            </div>
            <div id='usfaForm' hidden=''>
                {{usfaCardForm.as_p}}
            </div>
            <br>
            <input type="submit" value="Submit" />
        </form>
    {% endif %}

{% endblock %}